<template>
	<view class="box">
		<view class="head">
			<view class="head_left" @click="fanhui">
				<image src="http://oos-cn.ctyunapi.cn/hfclass/fanhui.png?Signature=UxKzt/fO7QiCKXVEBjkGnSGdoIw%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101242" style="width: 16rpx;height: 30rpx;margin-right: 20rpx;"  ></image>
				<text>返回</text>
			</view>
			<view style="position: relative;left: -16rpx;">数据详情</view>
			<view class="head_right" >
				<view v-if="isNo" @click="alter">修改</view>
				<view v-else @click="cancel">取消</view>
				<!-- <image src="http://111.62.51.251:8081/hfclass/设置30X30.png"  style="width: 36rpx;height: 36rpx;" ></image> -->
				<!-- <view class="windows" v-if="IsSet">
					<view class="windows_box">
						<view @click="message">个人信息</view>
						<view @click="mit">提交记录</view>
					</view>
				</view> -->
			</view>
		</view>
		
		<view class="dian"></view>
		<view class="content" >
			<view class="imgt">
				<image src="https://hfhealth.oss-cn-beijing.aliyuncs.com/Common/appbanner.jpg"></image>
			</view>
			<view class="school" >
				<view class="date">
					<view>选择上报人</view>
					<view class="opp">
						<text>{{name}}</text>
						<!-- <image src="http://111.62.51.251:8081/hfclass/选择箭头15X22.png"></image> -->
					</view>
				</view>
			</view>
			<view class="school" >
				<view class="date">
					<view>日期选择</view>
					<view class="opp">
						<text>{{date}}</text>
						<!-- <image src="http://111.62.51.251:8081/hfclass/选择箭头15X22.png"></image> -->
					</view>
				</view>
				
			</view>
			
			<view class="AnimalHeat">
				<view>
					<view>填写体温</view>
					<input type="number" maxlength="4" :disabled="isNo" :focus="!isNo" @input="purs" placeholder="填写体温" v-model="tiwen" />
				</view>
			</view>
			<view class="AnimalHeat">
				<view>
					<view>检测人</view>
					<input type="text" maxlength="5" :disabled="isNo"  @input='man'  placeholder="填写检测人" v-model="person" />
				</view>
			</view>
			<view class="box_one">
				<view class="boxEs">
					<view>
						<text style="color: #0081FF;">单选</text>
						<text>是否出现下列四种情况？</text>
					</view>
					<view class="radios" @click="grtcd(index)" v-for="(item,index) in lisp" :key='index'>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
						 v-if="index==grt" style="width: 40rpx;height: 40rpx;"></image>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
						 v-else style="width: 40rpx;height: 40rpx;"></image>
						<text style="margin-left: 20rpx;">{{item.value}}</text>
					</view>
				</view>
			</view>
			<view class="box_one">
				<view class="boxEs">
					<view>
						<text style="color: #0081FF;">单选</text>
						<text>你的家人朋友是否出现下列四种情况？</text>
					</view>
					<view class="radios" @click="oncik(index)" v-for="(item,index) in list" :key='index'>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
						 v-if="index==on" style="width: 40rpx;height: 40rpx;"></image>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
						 v-else style="width: 40rpx;height: 40rpx;"></image>
						<text style="margin-left: 20rpx;">{{item.value}}</text>
					</view>
				</view>
			</view>
			<view class="box_one rttt">
				<view class="boxEs">
					<view>
						<text style="color: #0081FF;">单选</text>
						<text>救治及防护措施</text>
					</view>
					<view class="radios" @click="inclk(index)" v-for="(item,index) in liser" :key='index'>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
						 v-if="index==ins" style="width: 40rpx;height: 40rpx;"></image>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
						 v-else style="width: 40rpx;height: 40rpx;"></image>
						<text style="margin-left: 20rpx;">{{item.value}}</text>
					</view>
				</view>
			</view>
			
			<view class="box_one rttt" v-show="grt==0||grt==1||grt==2||grt==3">
				<view class="boxEs">
					<view>
						<text style="color: #0081FF;">单选</text>
						<text>是否经过核酸检测</text>
					</view>
					<view class="radios" @click="insClicke(index)" v-for="(item,index) in hsjc" :key='index'>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
						 v-if="index==ins5" style="width: 40rpx;height: 40rpx;"></image>
						<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
						 v-else style="width: 40rpx;height: 40rpx;"></image>
						<text style="margin-left: 20rpx;">{{item.value}}</text>
					</view>
				</view>
			</view>
			
			<view v-show="grt==0||grt==1||grt==2||grt==3">
				<view class="box_one rttt" v-show="ins5==0">
					<view class="boxEs">
						<view>
							<text style="color: #0081FF;">单选</text>
							<text>第一次检测情况</text>
						</view>
						<view class="radios" @click="insClickf(index)" v-for="(item,index) in firstList" :key='index'>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
							 v-if="index==ins6" style="width: 40rpx;height: 40rpx;"></image>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
							 v-else style="width: 40rpx;height: 40rpx;"></image>
							<text style="margin-left: 20rpx;">{{item.value}}</text>
						</view>
					</view>
				</view>
				<view class="box_one rttt" v-show="ins5==0">
					<view class="boxEs">
						<view>
							<text style="color: #0081FF;">单选</text>
							<text>第二次检测情况</text>
						</view>
						<view class="radios" @click="insClickg(index)" v-for="(item,index) in twoList" :key='index'>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
							 v-if="index==ins7" style="width: 40rpx;height: 40rpx;"></image>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
							 v-else style="width: 40rpx;height: 40rpx;"></image>
							<text style="margin-left: 20rpx;">{{item.value}}</text>
						</view>
					</view>
				</view>
				<view class="box_one rttt" v-show="ins5==0">
					<view class="boxEs">
						<view>
							<text style="color: #0081FF;">单选</text>
							<text>本人现在所处地域是否省内</text>
						</view>
						<view class="radios" @click="insClickh(index)" v-for="(item,index) in site" :key='index'>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E9%80%89%E4%B8%AD24X24.png?Signature=uadBOt7JPRWF1p%2BYdBuY9uJvJO0%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101415"
							 v-if="index==ins8" style="width: 40rpx;height: 40rpx;"></image>
							<image src="http://oos-cn.ctyunapi.cn/hfclass/%E6%9C%AA%E9%80%89%E4%B8%AD24X24.png?Signature=v//XYi/k9NaPp0RRUYa8gALBcSY%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585101610"
							 v-else style="width: 40rpx;height: 40rpx;"></image>
							<text style="margin-left: 20rpx;">{{item.value}}</text>
						</view>
					</view>
				</view>
				<view class="box_one" v-show="ins5==1||ins7==3">
					<view class="weiConent">
						<view>未进行核酸检测原因及其他需要说明的事项</view>
						<textarea  v-model="texent"/>
					</view>
				</view>
			</view>
			
			
		</view>
		<view class="submit" @click="sub" v-if="!isNo">
			<view>提交信息</view>
		</view>
		
		<view v-if="loadModal" class="MaskLayer"></view>
		<view class="gif" v-if="loadModal">
			<view>
				<image src="http://oos-cn.ctyunapi.cn/hfclass/jiazai.gif?Signature=OgNX%2BUIeALb4HM35vCGC1jX%2BZEw%3D&AWSAccessKeyId=65b300139cc5a0aa9572&Expires=865585100785"></image>
				<view>请耐心等待！</view>
			</view>
		</view>
	</view>
</template>

<script>
	import App from '../../App.vue'
	export default {
		data() {
			return {
				date: [],
				name:'',
				loadModal:false,
				tiwen:'',
				person:'',
				hsjc:[{value:'是'}, {value:'否'}],//是否经过核酸检测
				firstList:[{value:'阴性'}, {value:'阳性'}, {value:'等待检测结果'}],//第一次检测情况
				twoList:[{value:'阴性'}, {value:'阳性'}, {value:'等待检测结果'},{value:'未检测'}],//第二次检测情况
				site:[{value:'是'}, {value:'否'}],//本人现在所处地域
				ins5:1,
				ins6:null,
				ins7:null,
				ins8:1,
				lisp: [{
					value: '确诊'
				}, {
					value: '疑似'
				}, {
					value: '密切接触者'
				}, {
					value: '发热人员'
				}, {
					value: '无'
				}],
				list: [{
					value: '确诊'
				}, {
					value: '疑似'
				}, {
					value: '密切接触者'
				}, {
					value: '发热人员'
				}, {
					value: '无'
				}],
				liser: [{
					value: '住院治疗'
				}, {
					value: '定点隔离'
				}, {
					value: '无'
				}],
				grt: 4,
				on: 4,
				ins: 2,
				texent:'',//未进行核酸检测原因
				id:'',
				objp:{},
				isNo:true,
				tim:'',
				userId:'',
				date:'',
				
			}
		},
		onLoad(op) {
			if(op){
				this.id=op.id
				this.userId=op.userId
				this.date=op.date
			}
		},
		created() {
			this.getList()
			this.getTime()
		},
		methods:{
			getList(){
				
				var that=this
				// that.loadModal = true
				// var lipp = uni.getStorageSync('storage_key');
				uni.request({
					method:'POST',
					url:App.globalData.baseUrl + '/api/services/app/organUser/GetHealthInfoByWx',
					data:{
						id:that.id,
						userId:that.userId,
						date:that.date
					},
					success(res) {
				        if(res.data.success==true){
							that.objp=res.data.result
							that.name=that.objp.userProfile.name
							that.tiwen=that.objp.userHeath.temperature
							that.person=that.objp.userHeath.testPerson
							that.texent=that.objp.userHeath.doNucleicAcidTestReason,
							that.lisp.forEach((item,index)=>{
								if(item.value==that.objp.userHeath.selfHealthy){
									that.grt=index
								}
							})
							that.list.forEach((item,index)=>{
								if(item.value==that.objp.userHeath.familyHealthy){
									that.on=index
								}
							})
							that.liser.forEach((item,index)=>{
								if(item.value==that.objp.userHeath.helpMethed){
									that.ins=index
								}
							})
							that.hsjc.forEach((item, index)=>{//第一次核酸检测
								if(item.value==that.objp.userHeath.doNucleicAcidTest){
									that.ins5=index
								}
							})
							that.firstList.forEach((item, index)=>{//第一次核酸检测
								if(item.value==that.objp.userHeath.firstResult){
									that.ins6=index
								}
							})
							that.twoList.forEach((item, index)=>{//第二次核酸检测
								if(item.value==that.objp.userHeath.secondResult){
									that.ins7=index
								}
							})
							that.site.forEach((item, index)=>{//本人现在所处区域
								if(item.value==that.objp.userHeath.selfCurrentArea){
									that.ins8=index
								}
							})
							that.date=String(that.objp.userHeath.reportTime).split('T')[0]
							that.loadModal=false
						}else{
							that.loadModal=false
							uni.showToast({
								title:res.data.error.message,
								duration:2000,
								icon:'none'	,
							})
						}
						
					},fail(res) {
						that.loadModal=false
						uni.showToast({
							title:res.data.error.message,
							duration:2000,
							icon:'none'	,
						})
					}
				})
			},
			confirm(){
				uni.navigateTo({
					url:'/pages/submit/CompleteInformation'
				})
			},
			getTime(){
				let date=new Date(),that=this
				var year = date.getFullYear();
				var month = date.getMonth() + 1;
				var strDate = date.getDate();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				that.tim=year+'-'+month+'-'+strDate
				// console.log(that.date)
			},
			grtcd(index){
				let that=this
				if(that.isNo==false){
					if(that.tiwen==''||that.tiwen==null){
						uni.showToast({
							title: '请先填报体温',
							duration: 2000,
							icon: 'none'
						})
					}else if(index==4 && that.tiwen >= 37.3){}else if(index==0||index==1||index==2||index==3){
						that.grt = index
						uni.showToast({
							title: '你已填报为异常人员',
							duration: 2000,
							icon: 'none'
						})
					}else{
						that.grt = index
					}
				}
			},
			oncik(index){
				let that=this
				if(that.isNo==false){
					that.on=index
				}
			},
			inclk(index){
				let that=this
				if(that.isNo==false){
					that.ins=index
				}
			},
			insClicke(index){
				let that=this
				if(that.isNo==false){
					that.ins5=index
				}
			},
			insClickf(index){
				let that=this
				if(that.isNo==false){
					that.ins6=index
				}
			},
			insClickg(index){
				let that=this
				if(that.isNo==false){
					that.ins7=index
				}
			},
			insClickh(index){
				let that=this
				if(that.isNo==false){
					that.ins8=index
				}
			},
			
			cancel(){
				this.isNo=true
				this.getList()
			},
			alter(){
				if(this.tim==this.date){
					this.isNo=false
					uni.showToast({
						title:'亲！你可以修改了哦',
						icon:'none',
						duration:2000	
					})
				}else{
					uni.showToast({
						title:'历史数据不能修改哦',
						icon:'none',
						duration:2000	
					})
				}
			},
			message(){
				uni.navigateTo({
					url:'/pages/submit/register'
				})
			},
			mit(){
				uni.navigateTo({
					url:'/pages/submit/PastRecords'
				})
			},
			man(e){
				let that=this
				that.person=e.detail.value
				if(that.person.length>0){
					that.person=that.person.replace(/[^\u4E00-\u9FA5]/g, '')
					if(that.person==''){
						uni.showToast({
							title:'请输入中文',
							duration:2000,
							icon:'none'
						})
					}
				}
			},
			purs(e){
				var that=this
			    that.temperature=e.detail.value
				if(that.temperature.length>=2){
					if(that.temperature>=35&that.temperature<42){
						if(that.temperature>=37.3){
							that.grt=3
						}else{
							that.grt=4
						}
					}else{
						that.tiwen=''
						that.grt=4
						uni.showToast({
							title:'请输入正常体温',
							icon:'none',
							duration:2000
						})	
					}
				}else if(that.temperature.length<=1){
					that.grt=4
				}	
			},
			fanhui(){
				uni.navigateBack({
					delta:1
				})
			},
			sub(){
				var that=this
				if(that.grt==4){
					that.ins5=1;
					that.texent='';
				}
				if(that.ins5==1){
					that.ins6=null;
					that.ins7=null;
					that.ins8=1;
				}else{
					if(that.ins7==0||that.ins7==1||that.ins7==2){
						that.texent=''
					}
				}
				
				if(that.ins5==0 && that.ins6==null){
					uni.showToast({
						title: '请填报第一次检测情况',
						duration: 1000,
						icon: 'none'
					});
				}else if(that.tiwen==''){
					uni.showToast({
					    title: '体温为空',
					    duration: 1000,
						icon:'none'
					});
				}else if(that.person==''){
					uni.showToast({
					    title: '检测人为空',
					    duration: 1000,
						icon:'none'
					});
				}else if(that.ins5==0 && that.ins6==null){
					uni.showToast({
						title: '请填报第一次检测情况',
						duration: 1000,
						icon: 'none'
					});
				}else if(that.ins5==0 && that.ins7==null){
					uni.showToast({
						title: '请填报第二次检测情况',
						duration: 1000,
						icon: 'none'
					});
				}else if((that.grt!=4&&that.ins5==0 && that.ins7==3&&that.texent=='')||(that.grt!=4&&that.ins5==1&&that.texent=='')){
					uni.showToast({
						title: '请填报未进行核酸检测原因',
						duration: 1000,
						icon: 'none'
					});
				}else {
				  that.loadModal=true
				  uni.request({
					  method:'POST',
					  url:App.globalData.baseUrl + '/api/services/app/organUser/SubmitUserHealth',
					  data:{
						    "id": that.objp.userHeath.id,
						    "userId": that.objp.userProfile.userId,
						    "reportTime": that.date,
						    "temperature": that.tiwen,
							"DoNucleicAcidTest":that.hsjc[that.ins5].value,//是否做过核酸检测
							"FirstResult":that.ins6==null?'':that.firstList[that.ins6].value,//第一次检测情况
							"SecondResult":that.ins7==null?'':that.twoList[that.ins7].value,//第二次检测情况
							"SelfCurrentArea":that.site[that.ins8].value,//本人现在所处区域
							"DoNucleicAcidTestReason":that.texent,//未进行核酸检测原因
						    "selfHealthy": that.lisp[that.grt].value,
						    "familyHealthy": that.list[that.on].value,
							"helpMethed": that.liser[that.ins].value,
							"testPerson": that.person,
						    "status": 0,
					  },
					  success(res) {
					  	if(res.data.success==true){
							that.loadModal=false
							uni.showToast({
								icon:'none',
								title: '提交成功',
								duration: 1500
							})
							// let tim=setTimeout(()=>{
							// 	uni.redirectTo({
							// 		url:'/pages/submit/PastRecords'
							// 	})
							// 	clearTimeout(tim)
							// },1500)
						}else{
							that.loadModal=false
							uni.showToast({
								icon:'none',
								title: res.data.error.message,
								duration: 2000
							})
						}
					  },fail(res) {
						  that.loadModal=false
							uni.showToast({
								title:res.data.error.message,
								duration:1000,
								icon:'none'	,
							})
						}
				  })
				}
			}
			
		}
	}
</script>

<style >
	.box{width: 100%;height: 100%;}
	.head{
		height: 120rpx;
		width: 100%;
		background-color: #FFFFFF;
		padding: 0 30rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 30rpx;
		position: fixed;
		top:0rpx;
		left:0rpx;
		z-index: 100;
	}
	.head_left{
		display: flex;
		align-items: center;
	}
	.head_right{
		position: relative;
	}
	.head_right>view{
		width: 100rpx;
		height: 50rpx;
		border-radius: 10rpx;
		background-color: #21D2A1;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.windows{
		position: absolute;
		top: 60rpx;
		right: 10rpx;
		z-index: 99;
	}
	.windows_box{
		width: 260rpx;
		background: #FFFFFF;
		padding: 0 30rpx;
		box-sizing: border-box;
		box-shadow:0rpx 0rpx 6rpx #000;
		border-radius: 10rpx;
	}
	.windows_box>view{
		width:100%;
		height: 90rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		text-align: center;
		line-height: 90rpx;
	}
	.windows_box>view:nth-child(1){
		border-bottom: 1rpx solid #DDDDDD;
	}
	
	.dian{width: 100%;height: 120rpx;}
	.imgt>image{
		width: 100%;
		height: 360rpx;
	}
	.content{
		width: 100%;
	}
	.content>.rttt{
		border-bottom: 0rpx;
	}
	.school{
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	.date{
		border-top: 1rpx solid #DDDDDD;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
	}
	.radios{
		margin-top: 20rpx;
		display: flex;
		align-items: center
	}
	.date>view:nth-child(2){
		display: flex;
		align-items: center;
	}
	.date>view:nth-child(2)>text{
		font-size: 30rpx;
	}
	.AnimalHeat{
		width: 100%;
		height: 100rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		background-color: #FFFFFF;
	}
	.AnimalHeat>view{
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-top:1rpx solid #D8D8D8;
	}
	.AnimalHeat>view>input{
		flex: 1;
		text-align: right;
	}
	.box_one{
		padding:0 30rpx;
		align-items: center;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	.boxEs{
		border-top: 1rpx solid #DDDDDD;
		padding: 30rpx 0;
		box-sizing: border-box;
	}
	.boxEs>view:nth-child(1)>text:nth-child(1){margin-right: 20rpx;}
	.box_one>.sex{
		height: 80rpx;
		display: flex;
		align-items: center;
	}
	.submit{
		width: 100%;
		height: 240rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.submit>view{
		width: 400rpx;
		height: 100rpx;
		background: #1CBBB4;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 60rpx;
	}
	.weiConent{
		width: 100%;
		padding: 30rpx 0rpx 30rpx;
		margin-top: 20rpx;
		border-top: 1rpx solid #DDDDDD;
	}
	.weiConent>view{font-size: 28rpx;}
	.weiConent>textarea{
		width: 100%;
		height: 300rpx;
		border: 1rpx solid #EDE1D9;
		padding: 20rpx;
		margin-top: 20rpx;
	}
	
	/* 弹窗 */
	.MaskLayer{
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0rpx;
		left: 0rpx;
		background: #000000;
		opacity: 0.6;
	}
	.gif>view>image{width: 160rpx;height: 160rpx;}
	.gif>view>view{color: #FFFFFF;text-align: center;margin-top: 10rpx;font-size: 28rpx;}
	.gif{
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		position: fixed;
		top: 0;
		left: 0;
	}
</style>
